<template>
  <div>
    <div class="limit-show-container">
      <div class="limit-left">
        <div class="limit-left-container">
          <div class="limit-left-lable">授信总额度</div>
          <div class="limit-left-content">1,000,000.00元</div>
        </div>
        <div class="limit-left-container">
          <div class="limit-left-lable">授信期限</div>
          <div class="limit-left-content">12月</div>
        </div>
        <div class="limit-left-container">
          <div class="limit-left-lable">当前可用额度</div>
          <div class="limit-left-content">220,000.00元</div>
        </div>
      </div>
      <div class="limit-right">
        <el-progress type="circle" :percentage="22" :width="200" ></el-progress>
      </div>
    </div>
  </div>
</template>

<script>
    export default {
        name: 'LimitShow',
        data() {
            return {

            }
        },
      computed:{
        creditInfo(){
            return this.$store.state.creditInfo||{};
          }
      }
    }
</script>

<style lang="stylus" scoped>
  .limit-show-container
    margin-top 20px
    display flex
    flex-direction row
    flex-wrap wrap
  .limit-left
    width 50%
  .limit-left-container
    display flex
    margin 30px 20px
  .limit-left-lable
    display flex
    justify-content flex-end
    width 200px
  .limit-left-content
    margin-left 20px
</style>
